<!--管理员=》用户黑名单-->
<template>
	<div>
	  <MainContent>
		 <div class="content_title">
		 	<span style="color: #222222;font-size: 24px;font-weight: 400;">{{title}}</span>
<!-- 		 	<button class="el-button mini addBuss" @click="lookUserDown"> 黑名单</button> -->		 
</div>
		 <div class="table_content">
		 	<el-row>
				  <el-input
    placeholder="请输入用户名或用户编号"
		style="width:320px;"
    v-model="UserInput">
		<el-button slot="append" icon="el-icon-search" @click="SearchUser"></el-button>
  </el-input>
			   <el-table
		        ref="multipleTable"
		        :data="userListData"
		        style='width: 99%;'
		        tooltip-effect="dark">
		        <el-table-column
		          align="center"
		          type='index'
		          label="#">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop="UserName"
		          label="用户昵称">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop="UserNo"
		          label="用户编码">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop="UserScore"
		          label="用户积分">
		        </el-table-column>
		        <el-table-column
		          align="center"
		          prop='Level'
		          label="淘宝等级">
		        </el-table-column>
		       	<el-table-column
		          align="center"
		          prop='NoComplete'
		          label="未完成次数">
		        </el-table-column>
						<el-table-column
							align="center"
							prop='TimeOut'
							label="超时退出次数">
						</el-table-column>
		        <el-table-column
		          align="center"
		          label="操作">
		          <template slot-scope="scope">
				        <el-button 
				        	type='info'
				        	size='mini' 
							@click="userGoDown(scope.$index, scope.row)">恢复</el-button>
				   </template>
		        </el-table-column>
		     </el-table>
		 	</el-row>
		 	
		 	<el-row style='margin-top: 20px;text-align: center;'>
			 	<el-pagination 
					  @current-change="handleCurrentChange"
					  :current-page="currentPage"
			    	   layout="prev, pager, next" 
			    	   page-size='10'
			    	  :total="allPage" 
			    	>
			    </el-pagination>
			</el-row>
		 </div>
		 
		 
      </MainContent>
   </div>
</template>
<script>
	import MainContent from '../components/main_content'
	import global from './global'
	export default {
    name: "UserBlack",
    inject:['reload'],
    mounted(){
    	this.initData('1');
    },
    data() {
    	return {
    		title: '黑名单',
    		userListData: [],
    		goDownShow: false,
    		ifSubmit: false,
    		allPage: '',
    		currentPage: '1',
    		userGoDownId: '',
    		goDownDay: '',
			UserInput:""
    	}
    },
    components:{
    	MainContent
    },
    methods:{
    	initData(pageNum){
    		let _this = this;
    		global.$http({
						method:'get',
						url:global.urlAll+'ShowAllBlackUser/',
						headers:{
							'Content-Type':'application/x-www-form-urlencoded',
							'cache-control': 'no-cache, no-store',
							'Pragma': 'no-cache'
						},
						params:{
							keyWord: _this.UserInput,
							Page: pageNum || '1',
							Row: '10'
						}
					}).then((res)=>{
						if(res.data.success == 'true'){
							_this.userListData = res.data.data;
							_this.allPage = res.data.DateNum;
							
						}else{
							_this.$message(res.msg)
						}
					})
    	},
    	SearchUser(){
				let _this = this;
			this.currentPage = '1';
    		this.initData('1');
    		
    	},
    	//恢复
    	userGoDown(index,row){
					
					//恢复
					let _this = this;
						global.$http({
								method:'get',
								url:global.urlAll+'DeleteBlackUsers/',
								headers:{
									'Content-Type':'application/x-www-form-urlencoded',
									'cache-control': 'no-cache, no-store',
									'Pragma': 'no-cache'
								},
								params:{
									UserNo: row.UserNo,
								}
							}).then((res)=>{
								if(res.data.success == 'true'){
									_this.$message('恢复成功');
									_this.initData();
									
								}else{
									_this.$message(res.msg)
								}
							})				
    	},
    	handleCurrentChange(val){
    		let _this = this;
    		this.currentPage = val;
    		this.initData(val)
    	}
    },
   }
	
	
</script>

<style scoped="scoped">
	.content_title {
	padding-bottom: 30px;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    
  }
  .addBuss{
  	width: 150px;
  	height: 40px;
  	background: #1989FA;
  	color: #FFFFFF;
    font-weight: bold;
  }
  .table_content{
  	padding: 20px;
  	background: #FFFFFF;
  }
  table,tbody,thead {
	  width: 100% !important;
	}
	colgroup {
	  position: absolute;
	  width: 100% !important;
	  display: flex;
	}
	col {
	  flex: 1;
	  text-align: center;
	}
</style>